<div class="container">
    <form class="form-signin" #f="ngForm" (ngSubmit)="regHandle(f)">
        <h2 class="form-signin-heading">Please sign in</h2>
        <label for="email" class="sr-only">Email address</label>
        <input  #email="ngModel"  name="email" type="email" ngModel id="email" class="form-control" placeholder="登录邮箱" email="true" autofocus required>
        <!-- 表单验证 -->

        <div *ngIf="email.invalid && ( email.dirty || email.touched )" class="alert alert-danger">
            <div *ngIf="email.errors.required">
                <b>* </b> 请填写登录邮箱
            </div>
            <div *ngIf="email.errors.email">
                <b>* </b> 邮箱格式不正确
            </div>
        </div>

        <label for="password" class="sr-only">Password</label>
        <input #password="ngModel" name="password" ngModel type="password" id="password" class="form-control" placeholder="登录密码" required minlength="6">
        <!-- 表单验证 -->
        <div *ngIf="password.invalid && ( password.dirty || password.touched)" class="alert alert-danger">
            <div *ngIf="password.errors.required">
                <b>* </b> 请填写登录密码
            </div>
            <div *ngIf="password.errors.minlength">
                <b>* </b> 登录密码长度最少为6位
            </div>
        </div>

        <button [disabled]="!f.valid" class="btn btn-lg btn-primary btn-block" type="submit">立即注册</button>
    </form>
    <p class="info"><a href="javascript:;" [routerLink]="['/login']">Already have an account? Login here.</a></p>

</div>